package au.com.shiftyjelly.pocketcasts.endofyear.ui

import androidx.compose.animation.core.CubicBezierEasing
import androidx.compose.animation.core.LinearEasing
import androidx.compose.animation.core.animateFloat
import androidx.compose.animation.core.tween
import androidx.compose.animation.core.updateTransition
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.BoxWithConstraints
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredSize
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.scale
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.layout.onSizeChanged
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.platform.LocalInspectionMode
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import au.com.shiftyjelly.pocketcasts.compose.Devices
import au.com.shiftyjelly.pocketcasts.compose.components.PodcastImage
import au.com.shiftyjelly.pocketcasts.compose.components.TextH10
import au.com.shiftyjelly.pocketcasts.compose.components.TextP40
import au.com.shiftyjelly.pocketcasts.endofyear.R
import au.com.shiftyjelly.pocketcasts.endofyear.StoryCaptureController
import au.com.shiftyjelly.pocketcasts.localization.helper.FriendlyDurationUnit
import au.com.shiftyjelly.pocketcasts.localization.helper.toFriendlyString
import au.com.shiftyjelly.pocketcasts.models.to.LongestEpisode
import au.com.shiftyjelly.pocketcasts.models.to.Story
import com.airbnb.lottie.compose.LottieAnimation
import com.airbnb.lottie.compose.LottieCompositionSpec
import com.airbnb.lottie.compose.LottieConstants
import com.airbnb.lottie.compose.animateLottieCompositionAsState
import com.airbnb.lottie.compose.rememberLottieComposition
import dev.shreyaspatil.capturable.capturable
import java.io.File
import au.com.shiftyjelly.pocketcasts.localization.R as LR
import au.com.shiftyjelly.pocketcasts.ui.R as UR

private const val ANIMATION_SCALE_FACTOR_FULL_WIDTH = 1.2f

@OptIn(ExperimentalComposeUiApi::class)
@Composable
internal fun LongestEpisodeStory(
    story: Story.LongestEpisode,
    measurements: EndOfYearMeasurements,
    controller: StoryCaptureController,
    onShareStory: (File) -> Unit,
) {
    Box {
        BoxWithConstraints(
            modifier = Modifier
                .capturable(controller.captureController(story))
                .fillMaxSize()
                .background(story.backgroundColor)
                .padding(top = measurements.closeButtonBottomEdge + 16.dp, bottom = 64.dp),
        ) {
            var headerHeight by remember { mutableStateOf(0.dp) }
            var footerHeight by remember { mutableStateOf(0.dp) }
            val density = LocalDensity.current
            Header(
                story = story,
                measurements = measurements,
                modifier = Modifier
                    .fillMaxWidth()
                    .onSizeChanged { size ->
                        with(density) { headerHeight = size.height.toDp() }
                    }
                    .align(Alignment.TopCenter),
            )
            Footer(
                modifier = Modifier
                    .fillMaxWidth()
                    .onSizeChanged { size ->
                        with(density) { footerHeight = size.height.toDp() }
                    }
                    .align(Alignment.BottomCenter),
                story = story,
                measurements = measurements,
            )

            val contentHeight = maxHeight - headerHeight - footerHeight
            // reduce the size to account for the growth during the animation
            val contentHeightMinusGrowth = contentHeight / ANIMATION_SCALE_FACTOR_FULL_WIDTH
            Content(
                story = story,
                forceVisible = controller.isSharing,
                modifier = Modifier
                    .padding(top = 32.dp)
                    .size(contentHeightMinusGrowth)
                    .align(Alignment.Center),
                size = contentHeightMinusGrowth,
            )
        }
        ShareStoryButton(
            modifier = Modifier
                .padding(bottom = 18.dp)
                .align(alignment = Alignment.BottomCenter),
            story = story,
            controller = controller,
            onShare = onShareStory,
        )
    }
}

@Composable
private fun Content(
    story: Story.LongestEpisode,
    forceVisible: Boolean,
    size: Dp,
    modifier: Modifier = Modifier,
) = BoxWithConstraints(
    modifier = modifier,
    contentAlignment = Alignment.Center,
) {
    val composition by rememberLottieComposition(
        spec = LottieCompositionSpec.RawRes(R.raw.playback_longest_episode_lottie),
    )
    val isPreview = LocalInspectionMode.current
    val freezeAnimation = forceVisible || isPreview

    val progress by animateLottieCompositionAsState(
        composition = composition,
        iterations = LottieConstants.IterateForever,
        isPlaying = !freezeAnimation,
    )
    val hasAnimationStarted = progress > 0f

    LottieAnimation(
        composition = composition,
        progress = { if (freezeAnimation) 1f else progress },
        modifier = Modifier
            .matchParentSize()
            .scale(1.2f),
        contentScale = ContentScale.FillWidth,
    )
    var artworkTrigger by remember { mutableStateOf(false) }
    LaunchedEffect(hasAnimationStarted, freezeAnimation) {
        artworkTrigger = freezeAnimation || hasAnimationStarted
    }

    val artworkTransition = updateTransition(artworkTrigger, "artwork transition")
    val scaleAnimation by artworkTransition.animateFloat(
        transitionSpec = {
            tween(durationMillis = 1250, easing = CubicBezierEasing(.18f, 0f, .08f, 1f))
        },
    ) {
        if (it) {
            1f
        } else {
            1.1f
        }
    }
    val alphaAnimation by artworkTransition.animateFloat(
        transitionSpec = {
            tween(durationMillis = 100, easing = LinearEasing)
        },
    ) {
        if (it) {
            1f
        } else {
            0f
        }
    }

    PodcastImage(
        uuid = story.episode.podcastId,
        contentDescription = story.episode.podcastTitle,
        elevation = 0.dp,
        cornerSize = 4.dp,
        modifier = Modifier
            .requiredSize(size * .6f)
            .scale(scaleAnimation)
            .offset(y = -maxHeight * .2f)
            .graphicsLayer {
                alpha = alphaAnimation
            },
    )
}

@Composable
private fun Header(
    story: Story.LongestEpisode,
    measurements: EndOfYearMeasurements,
    modifier: Modifier = Modifier,
) {
    Column(
        modifier = modifier.semantics(mergeDescendants = true) {},
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.spacedBy(8.dp),
    ) {
        val context = LocalContext.current
        TextH10(
            text = stringResource(
                LR.string.end_of_year_story_longest_episode_title,
                remember(story.episode.duration, context) {
                    story.episode.duration.toFriendlyString(
                        resources = context.resources,
                        minUnit = FriendlyDurationUnit.Minute,
                    )
                },
            ),
            fontSize = 25.sp,
            lineHeight = 30.sp,
            textAlign = TextAlign.Center,
            fontScale = measurements.smallDeviceFactor,
            disableAutoScale = true,
            color = colorResource(UR.color.white),
            modifier = Modifier.padding(horizontal = 24.dp),
        )
        TextP40(
            text = stringResource(
                LR.string.end_of_year_story_longest_episode_subtitle,
                story.episode.episodeTitle,
                story.episode.podcastTitle,
            ),
            disableAutoScale = true,
            color = colorResource(UR.color.white),
            fontWeight = FontWeight.W500,
            modifier = Modifier.padding(horizontal = 24.dp),
        )
    }
}

@Composable
private fun Footer(
    story: Story.LongestEpisode,
    measurements: EndOfYearMeasurements,
    modifier: Modifier = Modifier,
) = Box(
    modifier = modifier,
    contentAlignment = Alignment.BottomCenter,
) {
    TextP40(
        text = stringResource(LR.string.end_of_year_story_longest_episode_stats, story.episode.episodeTitle, story.episode.podcastTitle),
        textAlign = TextAlign.Center,
        disableAutoScale = true,
        fontScale = measurements.smallDeviceFactor,
        color = colorResource(UR.color.white),
        modifier = Modifier
            .padding(horizontal = 24.dp)
            .padding(bottom = 24.dp),
    )
}

@Preview(device = Devices.PORTRAIT_REGULAR)
@Composable
private fun LongestEpisodePreview() {
    PreviewBox(currentPage = 6) { measurements ->
        LongestEpisodeStory(
            story = Story.LongestEpisode(
                episode = LongestEpisode(
                    episodeId = "episode-id",
                    episodeTitle = "Episode Title",
                    podcastId = "podcast-id",
                    podcastTitle = "Podcast Title",
                    durationSeconds = 9250.0,
                    coverUrl = null,
                ),
            ),
            measurements = measurements,
            controller = StoryCaptureController.preview(),
            onShareStory = {},
        )
    }
}
